<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, user-scalable=no">
		<title>分享赚钱</title>
		<link rel="stylesheet" href="/static/css/style.css" />

	</head>

	<body>
		<div class="container" id="share" v-cloak>
			<div class="intro">
				<p>分享属于你的专属二维码 </p>
				<p>凡是从二维码扫描关注公众号的用户都将成为你团队的一员 </p>
				<p>团队成员使用本平台从淘宝、天猫的每笔消费都将获得消费分红，同时你也能从团队成员的消费中获得一定比例的返佣
				</p>
				<img :src="share.qrcode" alt="推广专属二维码" v-if="share.qrcode" />
			</div>

			<div class="share">

				<h4>点击右上角，开启分享分红之旅</h4>
				<ul>
					<li @click="doShare">
						<a><i class="icon icon-weixin"></i> <span>微信好友</span></a>
					</li>
					<li @click="doShare">
						<a><i class="icon icon-pengyouquan"></i> <span>微信朋友圈</span></a>
					</li>
					<li @click="doShare">
						<a><i class="icon icon-qq"></i> <span>QQ</span></a>
					</li>
					<li @click="doShare">
						<a><i class="icon icon-qzone"></i> <span>QQ空间</span></a>
					</li>
					<li @click="doShare">
						<a><i class="icon icon-weibo"></i> <span>微博</span></a>
					</li>
					<li @click="doShare(1)">
						<a><i class="icon icon-xiazai"></i> <span>下载二维码</span></a>
					</li>

				</ul>
				<div class="clearfix"></div>
			</div>
		</div>

	</body>
	<script src="/static/js/mui.min.js"></script>
	<script src="/static/js/vue.min.js"></script>
	<script src="/static/js/zepto.min.js"></script>
	<script src="/static/js/plugins/popup.js"></script>
	<script src="/static/js/plugins/input.js"></script>
	<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
	<script type="text/javascript">
		var share = new Vue({
			el: '#share',
			delimiters: ['${', '}'],
			data: {

				share: {
					title: "扫码关注我，开启网购省钱之旅",
					desc: "使用本公众号从淘宝、天猫的每笔消费您都将获得消费分红，更有额外大额优惠券，轻松省钱。",
					link: "",
					qrcode: ""
				}

			},
			mounted: function() {
				var self = this;

				this.request();

			},

			methods: {
				doShare(type) {

					if(type == 1) {
						return popup.prompt("长按二维码图片保存到手机", () => {

						});
					}

					return popup.prompt("点击右上角进行分享", () => {

					});

				},
				request() {
					var self = this;

					$.post('/app/wxmp/user/share', {

					}, function(res) {
						if(res.errno == 0) {
							self.share.qrcode = res.data.qrcode;
							self.share.link = "http://" + window.location.host + "/app/wxmp/oauth/qrcode?id=" + res.data.qrcode_id;
							self.sign();

						} else {
							popup.prompt(res.errmsg);
						}
					});

				},
				sign() {

					var self = this;

					$.post('/app/wxmp/user/wxsign', {
						url: window.location.href

					}, function(res) {
						if(res.errno == 0) {

							console.log("22222222222")
							wx.config({
								debug: false,
								appId: res.data.appid,
								timestamp: res.data.timestamp,
								nonceStr: res.data.nonceStr,
								signature: res.data.signature,
								jsApiList: ["onMenuShareTimeline", "onMenuShareAppMessage", "onMenuShareQQ", "onMenuShareWeibo", "onMenuShareQZone", "showMenuItems", "hideMenuItems"]
							});
							wx.ready(function() {
								console.log("1111111111111111")

								wx.showMenuItems({
									menuList: ["menuItem:share:appMessage", "menuItem:share:timeline", "menuItem:share:qq", "menuItem:share:QZone", "menuItem:share:weiboApp", ]
								});
								wx.hideMenuItems({
									menuList: ["menuItem:favorite", "menuItem:share:facebook", "menuItem:editTag", "menuItem:delete", "menuItem:copyUrl", "menuItem:originPage", "menuItem:readMode", "menuItem:openWithQQBrowser", "menuItem:openWithSafari", "menuItem:share:email", "menuItem:share:brand"]
								});

								wx.onMenuShareAppMessage({
									title: self.share.title, // 分享标题
									desc: self.share.desc, // 分享描述
									link: self.share.link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
									imgUrl: self.share.qrcode, // 分享图标

									success: function() {
										// 用户确认分享后执行的回调函数
									},
									cancel: function() {
										// 用户取消分享后执行的回调函数
									}
								});

								wx.onMenuShareTimeline({
									title: self.share.title, // 分享标题

									link: self.share.link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
									imgUrl: self.share.qrcode, // 分享图标
									success: function() {
										// 用户确认分享后执行的回调函数
									},
									cancel: function() {
										// 用户取消分享后执行的回调函数
									}
								});

								wx.onMenuShareQQ({
									title: self.share.title, // 分享标题
									desc: self.share.desc, // 分享描述
									link: self.share.link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
									imgUrl: self.share.qrcode, // 分享图标
									success: function() {
										// 用户确认分享后执行的回调函数
									},
									cancel: function() {
										// 用户取消分享后执行的回调函数
									}
								});

								wx.onMenuShareQZone({
									title: self.share.title, // 分享标题
									desc: self.share.desc, // 分享描述
									link: self.share.link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
									imgUrl: self.share.qrcode, // 分享图标
									success: function() {
										// 用户确认分享后执行的回调函数
									},
									cancel: function() {
										// 用户取消分享后执行的回调函数
									}
								});

								wx.onMenuShareWeibo({
									title: self.share.title, // 分享标题
									desc: self.share.desc, // 分享描述
									link: self.share.link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
									imgUrl: self.share.qrcode, // 分享图标
									success: function() {
										// 用户确认分享后执行的回调函数
									},
									cancel: function() {
										// 用户取消分享后执行的回调函数
									}
								});

							});

						} else {
							popup.prompt(res.errmsg);
						}
					});

				}

			}

		});
	</script>

</html>